{% load static %}
{% load inventree_extras %}
{% load plugin_extras %}
{% load i18n %}

{% settings_value 'BARCODE_ENABLE' as barcodes %}
{% settings_value 'STICKY_HEADER' user=request.user as sticky %}
{% navigation_enabled as plugin_nav %}

{% inventree_show_about user as show_about %}
{% inventree_customize 'navbar_message' as navbar_message %}
{% inventree_customize 'hide_admin_link' as hide_admin_link %}

<nav class="navbar {% if sticky %}fixed-top{% endif %} navbar-expand-lg navbar-light">
  <div class="container-fluid">
    <div class="navbar-header clearfix content-heading">
      <a class="navbar-brand" id='logo' href="{% url 'index' %}" style="padding-top: 7px; padding-bottom: 5px;"><img src="{% inventree_logo %}" alt="{% trans 'InvenTree logo' %}" width="32" height="32" style="display:block; margin: auto;"/></a>
    </div>
    <div class="navbar-collapse collapse" id="navbar-objects">
      <ul class="navbar-nav">
        {% if roles.part.view %}
        <li class='nav-item'>
          <a class='nav-link' href="{% url 'part-index' %}">
            <span class='fas fa-shapes icon-header'></span>{% trans "Parts" %}
          </a>
        </li>
        {% endif %}
        {% if roles.stock.view %}
        <li class='nav-item'>
          <a class='nav-link' href="{% url 'stock-index' %}">
            <span class='fas fa-boxes icon-header'></span>{% trans "Stock" %}
          </a>
        </li>
        {% endif %}
        {% if roles.build.view %}
        <li class='nav-item'>
          <a class='nav-link' href="{% url 'build-index' %}">
            <span class='fas fa-tools icon-header'></span>{% trans "Build" %}
          </a>
        </li>
        {% endif %}
        {% if roles.purchase_order.view %}
        <li class='nav-item dropdown'>
          <a class='nav-link dropdown-toggle' href='#' id='buyMenuDropdown' role='button' data-bs-toggle='dropdown'>
            <span class='fas fa-shopping-cart icon-header'></span>{% trans "Buy" %}
          </a>
          <ul class='dropdown-menu' aria-labelledby="buyMenuDropdown">
            <li><a class='dropdown-item' href="{% url 'supplier-index' %}"><span class='fas fa-building icon-header'></span>{% trans "Suppliers" %}</a></li>
            <li><a class='dropdown-item' href="{% url 'manufacturer-index' %}"><span class='fas fa-industry icon-header'></span>{% trans "Manufacturers" %}</a></li>
            <li><a class='dropdown-item' href="{% url 'purchase-order-index' %}"><span class='fas fa-list icon-header'></span>{% trans "Purchase Orders" %}</a></li>
          </ul>
        </li>
        {% endif %}
        {% if roles.sales_order.view or roles.return_order.view %}
        <li class='nav-item dropdown'>
          <a class='nav-link dropdown-toggle' href='#' id='sellMenuDropdown' role='button' data-bs-toggle='dropdown'>
            <span class='fas fa-truck icon-header'></span>{% trans "Sell" %}
          </a>
          <ul class='dropdown-menu'>
            <li><a class='dropdown-item' href="{% url 'customer-index' %}"><span class='fas fa-user-tie icon-header'></span>{% trans "Customers" %}</a>
            {% if roles.sales_order.view %}
            <li><a class='dropdown-item' href="{% url 'sales-order-index' %}"><span class='fas fa-list icon-header'></span>{% trans "Sales Orders" %}</a></li>
            {% endif %}
            {% if roles.return_order.view and return_order_enabled %}
            <li><a class='dropdown-item' href="{% url 'return-order-index' %}"><span class='fas fa-undo icon-header'></span>{% trans "Return Orders" %}</a></li>
            {% endif %}
          </ul>
        </li>
        {% endif %}

        {% if plugin_nav %}
        {% plugin_list as pl_list %}
        {% for plugin_key, plugin in pl_list.items %}
          {% mixin_enabled plugin 'navigation' as navigation %}
          {% if navigation %}
          <li class='nav-item dropdown'>
            <a class='nav-link dropdown-toggle' data-bs-toggle="dropdown" aria-expanded="false" href='#'>
              <span class='{{ plugin.navigation_icon }} icon-header'></span>{{ plugin.navigation_name }}
            </a>
            <ul class='dropdown-menu'>
             {% for nav_item in plugin.navigation %}
                {% safe_url nav_item.link as nav_link %}
                {% if nav_link %}
                <li><a href="{{ nav_link }}" class="dropdown-item"><span class='{{ nav_item.icon }} icon-header'></span>{{ nav_item.name }}</a>
                {% endif %}
             {% endfor %}
            </ul>
          </li>
          {% endif %}
        {% endfor %}
        {% endif %}

      </ul>
    </div>
    {% if navbar_message %}
      {% include "spacer.html" %}
      <div class='flex justify-content-center'>
        {{ navbar_message | safe }}
      </div>
      {% include "spacer.html" %}
      {% include "spacer.html" %}
    {% endif %}

    <ul class='navbar-nav flex-row'>

      <li class='nav-item me-2'>
        <button data-bs-toggle='offcanvas' data-bs-target="#offcanvas-search" class='btn position-relative' title='{% trans "Search" %}'>
          <span class='fas fa-search'></span>
        </button>
      </li>

      {% if barcodes %}
      <li class='nav-item' id='navbar-barcode-li'>
        <button id='barcode-scan' class='btn position-relative' title='{% trans "Scan Barcode" %}'>
          <span class='fas fa-qrcode'></span>
        </button>
      </li>
      {% endif %}

      <li class='nav-item me-2'>
        <button data-bs-toggle="offcanvas" data-bs-target="#offcanvas-notification" class='btn position-relative' title='{% trans "Show Notifications" %}'>
          <span class='fas fa-bell'></span>
          <span class="position-absolute top-100 start-100 translate-middle badge rounded-pill bg-danger d-none" id="notification-alert">
            <span class="visually-hidden">{% trans "New Notifications" %}</span>
            <span id="notification-counter">0</span>
          </span>
        </button>
      </li>

      <li class='nav-item me-2'>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-objects" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
      </li>
      <li class='nav-item dropdown'>
        <a class='nav-link dropdown-toggle' href='#' id='userMenuDropdown' role='button' data-bs-toggle='dropdown'>
          <span class='fas fa-user'></span> <strong>{{ user.get_username }}</strong>
        </a>
        <ul class='dropdown-menu dropdown-menu-end inventree-navbar-menu'>
          {% if user.is_authenticated %}
          {% if user.is_staff and not hide_admin_link %}
          {% admin_index user as admin_idx %}
          {% if admin_idx %}
          <li><a class='dropdown-item' href="{{ admin_idx }}"><span class="fas fa-user-shield"></span> {% trans "Admin" %}</a></li>
          {% endif %}
          {% endif %}
          <li><a class='dropdown-item' href="{% url 'settings' %}"><span class="fas fa-cog"></span> {% trans "Settings" %}</a></li>
          <li><a class='dropdown-item' href="{% url 'account_logout' %}"><span class="fas fa-sign-out-alt"></span> {% trans "Logout" %}</a></li>
          {% else %}
          <li><a class='dropdown-item' href="{% url 'account_login' %}"><span class="fas fa-sign-in-alt"></span> {% trans "Login" %}</a></li>
          {% endif %}
          <hr>
          <li id='launch-stats'>
            <a class='dropdown-item' href='#'>
              {% if system_healthy or not user.is_staff %}
              <span class='fas fa-server'></span>
              {% else %}
              <span class='fas fa-server icon-red'></span>
              {% endif %}
              {% trans "System Information" %}
            </a>
          </li>
          {% if show_about %}
          <li id='launch-about'>
            <a class='dropdown-item' href='#'>
              {% if up_to_date %}
              <span class="fas fa-info-circle"></span>
              {% else %}
              <span class='fas fa-info-circle icon-red'></span>
              {% endif %}
              {% trans "About InvenTree" %}
            </a>
          </li>
          {% endif %}
        </ul>
      </li>
    </ul>
  </div>
</nav>

{% if sticky %}
<div class='navbar-spacer'></div>
{% endif %}
